<%--
  Created by IntelliJ IDEA.
  User: srq
  Date: 2021/5/14
  Time: 10:23
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8"%>
<html>
<head>
    <title>首页</title>

    <script type="text/javascript">

        function test(){



           // 发送异步请求

           // 创建XMLHttpRequest对象
            var XMLHttp;

            if (window.XMLHttpRequest){
                // 非IE
                XMLHttp = new XMLHttpRequest();
            }else if(window.ActiveXObject){
                // IE浏览器
                XMLHttp = new ActiveXObject("Microsoft.XMLHttp");

            }


            // 打开链接
            var userName = document.getElementById("uname").value;

            //使用post方法传递参数
            XMLHttp.open("post","testuname",true);
            //补充请求头
            XMLHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded;charset=UTF-8");

           //指定回调函数
            XMLHttp.onreadystatechange=function (){
                //判断状态，返回值为4表示数据请求成功
                if (XMLHttp.readyState===4){
                    //接收返回的数据
                    document.getElementById("rs").innerText = XMLHttp.responseText;
                }
            }

           //发送数据
            XMLHttp.send("username="+userName);

        }

    </script>
</head>
<body>


<label for="uname">用户名：</label><input type="text" id="uname" onblur="test()"><span id="rs"></span>

<br>
<br>

<a href="jquery_ajax.jsp">数据填充</a>
</body>
</html>
